﻿<!DOCTYPE html>
<html class="no-js" lang="en">

<head>
    <meta charset="utf-8">
    <meta content="IE=edge" http-equiv="X-UA-Compatible">
    <meta content="width=device-width, initial-scale=1" name="viewport">
    <meta content="meta description" name="description">

    <!-- Site title -->
    <title>设置</title> <!-- Favicon -->
<link rel="icon" href="<%=ctxPath%>/static/favicon.ico" mce_href="<%=ctxPath%>/static/favicon.ico" type="image/x-icon" />

    <!-- Bootstrap CSS -->
    <link href="../assets/css/bootstrap.min.css" rel="stylesheet">
    <!-- Font-Awesome CSS -->
    <link href="../assets/css/font-awesome.min.css" rel="stylesheet">
    <!-- IonIcon CSS -->
    <link href="../assets/css/ionicons.min.css" rel="stylesheet">
    <!-- Plugins CSS -->
    <link href="../assets/css/plugins.css" rel="stylesheet">
    <!-- Main Style CSS -->
    <link href="../assets/css/style.css" rel="stylesheet">
</head>

<body>
<!-- header area start -->
<header>
    <!-- main menu area start -->
    <div class="header-main sticky">
        <div class="container custom-container">
            <div class="row align-items-center position-relative">
                <div class="col-lg-2 col-md-6 col-6 position-static">
                    <div class="logo">
                        <a href="index.html">
                            <img alt="Brand logo" src="../assets/img/logo/gues_welcome.jpg">
                        </a>
                    </div>
                </div>
                <div class="col-lg-8 d-none d-lg-block position-static">
                    <div class="main-header-inner">
                        <div class="main-menu">
                            <nav id="mobile-menu">
                                <ul>
                                    <li><a href="index.html">首页</a></li>
                                    <li><a href="shop-grid-full-width.html">商品</a></li>
                                    <li><a href="cart.html">购物车</a></li>

                                    <li><a href="collect.html">收藏</a></li>
                                    <li><a href="my-account.html">设置</a></li>
                                </ul>
                            </nav>
                        </div>
                    </div>
                </div>
                <div class="col-12 d-block d-lg-none">
                    <div class="mobile-menu"></div>
                </div>
            </div>
        </div>
    </div>
    <!-- main menu area end -->
</header>
<!-- header area end -->

<!-- my account wrapper start -->
<div class="my-account-wrapper section-padding">
    <div class="container custom-container">
        <div class="row">
            <div class="col-lg-12">
                <!-- My Account Page Start -->
                <div class="myaccount-page-wrapper">
                    <!-- My Account Tab Menu Start -->
                    <div class="row">
                        <div class="col-lg-3 col-md-4">
                            <div class="myaccount-tab-menu nav" role="tablist">
                                <a data-toggle="tab" href="#orders"><i class="fa fa-cart-arrow-down"></i> 订单</a>
                                <a data-toggle="tab" href="#payment-method"><i class="fa fa-credit-card"></i>
                                    付款方式</a>
                                <a data-toggle="tab" href="#address-edit"><i class="fa fa-map-marker"></i>
                                    地址</a>
                                <a data-toggle="tab" href="#account-info"><i class="fa fa-user"></i> 账户详细资料</a>
                                <a href="login.html"><i class="fa fa-sign-out"></i> 登出</a>
                            </div>
                        </div>
                        <!-- My Account Tab Menu End -->

                        <!-- My Account Tab Content Start -->
                        <div class="col-lg-9 col-md-8">
                            <div class="tab-content" id="myaccountContent">
                                <!-- Single Tab Content Start -->
                                <div class="tab-pane fade" id="orders" role="tabpanel">
                                    <div class="myaccount-content">
                                        <h3>订单</h3>
                                        <div class="myaccount-table table-responsive text-center">
                                            <table class="table table-bordered">
                                                <thead class="thead-light">
                                                <tr>
                                                    <th>订购</th>
                                                    <th>日期</th>
                                                    <th>状态</th>
                                                    <th>总价</th>
                                                    <th>行动</th>
                                                </tr>
                                                </thead>
                                                <tbody>
                                                <tr>
                                                    <td>1</td>
                                                    <td>2018年8月22日</td>
                                                    <td>待定</td>
                                                    <td>$3000</td>
                                                    <td><a class="check-btn sqr-btn " href="cart.html">视图</a>
                                                    </td>
                                                </tr>
                                                <tr>
                                                    <td>2</td>
                                                    <td>2018年7月22日</td>
                                                    <td>已批准</td>
                                                    <td>$200</td>
                                                    <td><a class="check-btn sqr-btn " href="cart.html">视图</a>
                                                    </td>
                                                </tr>
                                                <tr>
                                                    <td>3</td>
                                                    <td>2017年6月12日</td>
                                                    <td>等候接听</td>
                                                    <td>$990</td>
                                                    <td><a class="check-btn sqr-btn " href="cart.html">视图</a>
                                                    </td>
                                                </tr>
                                                </tbody>
                                            </table>
                                        </div>
                                    </div>
                                </div>
                                <!-- Single Tab Content End -->

                                <!-- Single Tab Content Start -->
                                <div class="tab-pane fade" id="payment-method" role="tabpanel">
                                    <div class="myaccount-content">
                                        <h3>付款方式</h3>
                                        <p class="saved-message">您还无法保存付款方式。</p>
                                    </div>
                                </div>
                                <!-- Single Tab Content End -->

                                <!-- Single Tab Content Start -->
                                <div class="tab-pane fade" id="address-edit" role="tabpanel">
                                    <div class="myaccount-content">
                                        <h3>账单地址</h3>
                                        <address>
                                            <p><strong>亚历克斯·图尼妮</strong></p>
                                            <p>市场街1355号，套房900 <br>
                                                旧金山，CA 94103</p>
                                            <p>手机：（123）456-7890</p>
                                        </address>
                                        <a class="check-btn sqr-btn " href="#"><i class="fa fa-edit"></i>编辑地址
                                        </a>
                                    </div>
                                </div>
                                <!-- Single Tab Content End -->

                                <!-- Single Tab Content Start -->
                                <div class="tab-pane fade" id="account-info" role="tabpanel">
                                    <div class="myaccount-content">
                                        <h3>账户详细资料</h3>
                                        <div class="account-details-form">
                                            <form action="#">
                                                <div class="row">
                                                    <div class="col-lg-6">
                                                        <div class="single-input-item">
                                                            <label class="required" for="first-name">名字</label>
                                                            <input id="first-name" placeholder="First Name"
                                                                   type="text"/>
                                                        </div>
                                                    </div>
                                                    <div class="col-lg-6">
                                                        <div class="single-input-item">
                                                            <label class="required" for="last-name">姓</label>
                                                            <input id="last-name" placeholder="Last Name"
                                                                   type="text"/>
                                                        </div>
                                                    </div>
                                                </div>
                                                <div class="single-input-item">
                                                    <label class="required" for="display-name">显示名称</label>
                                                    <input id="display-name" placeholder="Display Name"
                                                           type="text"/>
                                                </div>
                                                <div class="single-input-item">
                                                    <label class="required" for="email">邮箱地址</label>
                                                    <input id="email" placeholder="Email Address" type="email"/>
                                                </div>
                                                <fieldset>
                                                    <legend>修改密码</legend>
                                                    <div class="single-input-item">
                                                        <label class="required" for="current-pwd">当前密码</label>
                                                        <input id="current-pwd" placeholder="Current Password"
                                                               type="password"/>
                                                    </div>
                                                    <div class="row">
                                                        <div class="col-lg-6">
                                                            <div class="single-input-item">
                                                                <label class="required" for="new-pwd">新密码</label>
                                                                <input id="new-pwd" placeholder="New Password"
                                                                       type="password"/>
                                                            </div>
                                                        </div>
                                                        <div class="col-lg-6">
                                                            <div class="single-input-item">
                                                                <label class="required" for="confirm-pwd">确认密码</label>
                                                                <input id="confirm-pwd" placeholder="Confirm Password"
                                                                       type="password"/>
                                                            </div>
                                                        </div>
                                                    </div>
                                                </fieldset>
                                                <div class="single-input-item">
                                                    <button class="check-btn sqr-btn ">保存修改</button>
                                                </div>
                                            </form>
                                        </div>
                                    </div>
                                </div> <!-- Single Tab Content End -->
                            </div>
                        </div> <!-- My Account Tab Content End -->
                    </div>
                </div> <!-- My Account Page End -->
            </div>
        </div>
    </div>
</div>
<!-- my account wrapper end -->

<!-- footer area start -->
<footer>
    <!-- footer botton area start -->
    <div class="footer-bottom-area">
        <div class="container custom-container">
            <div class="row align-items-center">
                <div class="col-md-4 order-1">
                    <div class="footer-social-link">
                        <a href="#"><i class="fa fa-wechat"></i></a>
                        <a href="tencent://AddContact/?fromId=45&fromSubId=1&subcmd=all&uin=506031313"><i class="fa fa-qq"></i></a>
                        <a href="#"><i class="fa fa-weibo"></i></a>
                    </div>
                </div>
                <div class="col-md-4 order-3 order-md-2">
                    <div class="copyright-text text-center">
                        <p>版权<a href="#" title="self">@colouredglaze</a>保留所有权利</p>
                    </div>
                </div>
                <div class="col-md-4 ml-auto order-2 order-md-3">
                    <div class="footer-payment">
                        <img alt="" src="../assets/img/payment.png">
                    </div>
                </div>
            </div>
        </div>
    </div>
    <!-- footer botton area end -->
</footer>
<!-- footer area end -->

<!--All jQuery, Third Party Plugins & Activation (main.js) Files-->
<script src="../assets/js/vendor/modernizr-3.6.0.min.js"></script>
<!-- Jquery Min Js -->
<script src="../assets/js/vendor/jquery-3.3.1.min.js"></script>
<!-- Popper Min Js -->
<script src="../assets/js/vendor/popper.min.js"></script>
<!-- Bootstrap Min Js -->
<script src="../assets/js/vendor/bootstrap.min.js"></script>
<!-- Plugins Js-->
<script src="../assets/js/plugins.js"></script>
<!-- Ajax Mail Js -->
<script src="../assets/js/ajax-mail.js"></script>
<!-- Active Js -->
<script src="../assets/js/main.js"></script>
</body>

</html>
